// /* eslint-disable */
import React, { useState, useEffect } from 'react';
import { PageContainer } from '@ant-design/pro-layout';
import { Card, Button } from 'antd';
import { searchFormDataApply } from '../data';
import { history } from 'umi';
import { pageConditionQueryByCreatorId } from '../../services/actives'
import Table from '../../components/tableList/tablelist';
import moment from 'moment'
import Menuchange from "../../components/menu/menu";
import SearchForm from '../../components/searchForm/searchForm'
import './index.less'

const Welcome = () => {
  const [tableList, setTableList] = useState([]);// 页面列表数据
  const [pagination, setPagination] = useState({ current: 1, pageSize: 10 })
  const [dataObj, setDataObj] = useState({});// 每页条数
  const [dataObjmenu, setDataObjmenu] = useState({});// 每页条数
  const [loading, setLoading] = useState(false)

  const queryTableList = (pagination) => {
    let newPagination = JSON.parse(JSON.stringify(pagination).replace(/current/g, 'page'));
    setLoading(true);
    const params = {
      ...dataObj,
      ...dataObjmenu,
      ...newPagination
    }
    pageConditionQueryByCreatorId(params).then(res => {
      setLoading(false);
      setTableList(res.data.rows)
      console.log(res)
      setPagination({
        ...pagination,
        total: res.data.total,
      })

    });

  };
  useEffect(() => {
    queryTableList(pagination)
  }, []);
  // const detail = (record) => {

  //   history.push({
  //     pathname: "/details",
  //     query: {
  //       data: record
  //     }
  //   })

  // }

  /**
   * @description: Tabs切換
   * @param key tab key值
   * @param name tab選項卡
   * @return {*}
   */
  const menudata = [{ key: 1, name: '全部' }, { key: 2, name: '进行中' }, { key: 3, name: '未开始' }, { key: 4, name: '已结束' }, { key: 5, name: '待审核' }, { key: 6, name: '已驳回' }, { key: 7, name: '草稿箱' }]
  const handleSubmit = (values) => {
    let dataObj = {
      activityName: values.activityName,
      queryStartDate: values.startDate && moment(values.startDate[0]).format("YYYY-MM-DD"),
      queryEndDate: values.startDate && moment(values.startDate[1]).format("YYYY-MM-DD"),
    }
    setDataObj(dataObj)
  }

  const hanledClick = (e) => {
    setPagination({ current: 1, pageSize: 10 })
    // console.log(typeof(e.key))
    if (e.key == 1) {
      setDataObjmenu({})
    } else if (e.key == 2) {

      setDataObjmenu({ activityStatus: [2] })

    } else if (e.key == 3) {
      setDataObjmenu({ activityStatus: [3] })

    } else if (e.key == 4) {
      setDataObjmenu({ activityStatus: [5, 6] })

    } else if (e.key == 5) {
      setDataObjmenu({ activityStatus: [1] })

    } else if (e.key == 6) {
      setDataObjmenu({ activityStatus: [4] })

    } else if (e.key == 7) {
      setDataObjmenu({ isDraft: true })
    }
  }
  useEffect(() => {
    queryTableList({ current: 1, pageSize: 10 })
    setPagination({ current: 1, pageSize: 10 })
  }, [dataObj, dataObjmenu])

  const changepage = (pagination, filters, sorter) => {
    setPagination(pagination);
    queryTableList(pagination)
  }

  return (
    <PageContainer title={false}>
      <Card>
        <span className="active">活动管理</span>
        <div>
          <Menuchange menudata={menudata} hanledClick={hanledClick}></Menuchange>
          <SearchForm
            FormData={searchFormDataApply}
            handleSubmit={handleSubmit}
            showTime
          ></SearchForm>
          <Button className='add' type='primary' onClick={() => { history.push('/add') }}>+创建活动</Button>
          <Table loading={loading} data={tableList} pagination={pagination} queryTableList={queryTableList} changepage={changepage}> </Table>
        </div>
      </Card>
    </PageContainer>
  );
};
export default Welcome;
